/*
 * aqua-firefox-theme
 * tab-bar.css
 *
 * Copyright (c) 2019 Payson Wallach
 *
 * Released under the terms of the GNU General Public License, version 3
 * (https://gnu.org/licenses/gpl.html)
 */

@namespace xul "http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul";

#TabsToolbar .toolbar-items {
  margin-bottom: -1px !important;
}

/* hide scroll buttons */
.scrollbutton-down,
.scrollbutton-up {
  display: none;
}

/* remove shadow next to tab scroll buttons */
.arrowscrollbox-overflow-start-indicator,
.arrowscrollbox-overflow-end-indicator {
  display: none;
}

/* tab labels */

tab {
  color: var(--aqua-tab-color) !important;
}

tab:hover {
  color: var(--aqua-tab-hover-color) !important;
}

tab[selected] {
  color: var(--aqua-tab-active-color) !important;
}

tab:-moz-window-inactive {
  color: var(--aqua-inactive-tab-color) !important;
}

tab[selected]:-moz-window-inactive {
  color: var(--aqua-inactive-tab-active-color) !important;
}

.tab-label {
  -moz-box-flex: 1 !important;
  text-align: center !important;
}

/* prevent tab icons size breaking */
.tab-icon-image,
.tab-icon-sound,
.tab-throbber,
.tab-throbber-fallback,
.tab-close-button {
  min-width: 16px;
}

/* put tab close button and icon sound to the left */

.tab-icon-sound[soundplaying="true"],
.tab-icon-sound[muted="true"],
.tab-icon-sound[activemedia-blocked="true"] {
  margin-right: auto !important;
}

.tab-icon-sound {
  margin: 0 6px;
}

/* hide tab icons unless pinned */
.tabbrowser-tab:not([pinned]) .tab-icon-image {
  display: none;
}

/* close tab button */

.tab-close-button {
  -moz-appearance: none !important;
  border: none !important;
  box-sizing: content-box;
  /* avoid deformation on flexbox */
  border-radius: 3px;
  list-style-image: var(--aqua-tab-close-icon) !important;
  height: 16px;
  opacity: .3;
  padding: 2px;
  width: 16px;
}

:root:-moz-window-inactive .tab-close-button:not(#hack) {
  opacity: .18 !important;
}

:root:not(:-moz-window-inactive) .tab-close-button:hover {
  background-image: var(--aqua-button-background);
  box-shadow: var(--aqua-button-box-shadow);
  border: none !important;
  opacity: 1;
}

:root:not(:-moz-window-inactive) .tab-close-button:active {
  background-image: var(--aqua-button-active-background) !important;
  box-shadow: var(--aqua-button-active-box-shadow) !important;
}

.tab-close-button:active:not(:hover) {
  background-image: none !important;
  box-shadow: none !important;
}

/* remove blue line above tabs */
.tab-line {
  display: none;
}

/* move container lines to the top */

.tabbrowser-tab[usercontextid]>.tab-stack>.tab-background {
  border-top: 3px solid var(--identity-tab-color) !important;
}

.tabbrowser-tab[usercontextid]>.tab-stack>.tab-background>.tab-bottom-line {
  display: none;
}

/* active tab */

.tab-background[selected=true] {
  background-color: var(--aqua-tab-active-background) !important;
  background-image: none !important;
  border: 1px solid var(--aqua-tab-separator-color) !important;
  border-bottom: 1px solid var(--aqua-tab-border-color) !important;
  border-top: none !important;
  border-image: none !important;
  margin: 0 -1px !important;
}

.tab-background[selected=true]:-moz-window-inactive {
  background-color: var(--aqua-inactive-tab-active-background) !important;
  border: 1px solid var(--aqua-tab-separator-color) !important;
  border-bottom: 1px solid var(--aqua-tab-border-color) !important;
  border-top: none !important;
  border-image: none !important;
}

/* tab hover */

.tabbrowser-tab:hover>.tab-stack>.tab-background:not([selected=true]) {
  background-color: var(--aqua-tab-hover-background) !important;
  border-image: none !important;
  border-bottom: 1px solid var(--aqua-tab-border-color) !important;
}

:root:not(:-moz-window-inactive) .tabbrowser-tab:hover>.tab-stack>.tab-background[selected=true] {
  background-color: var(--aqua-tab-active-hover-background) !important;
  border-image: none !important;
  border-bottom: 1px solid var(--aqua-tab-border-color) !important;
}

.tabbrowser-tab:hover>.tab-stack>.tab-background:not([selected=true]),
#TabsToolbar[brighttext]>#tabbrowser-tabs>.tabbrowser-tab:hover>.tab-stack>.tab-background:not([selected=true]),
#TabsToolbar[brighttext]>#tabbrowser-tabs>.tabbrowser-tab:hover>.tab-stack>.tab-background>.tab-line:not([selected=true]) {
  background-color: var(--aqua-tab-active-hover-background) !important;
  border-image: none !important;
  border-bottom: 1px solid var(--aqua-tab-border-color) !important;
}

:root:not(:-moz-window-inactive) .tabbrowser-tab:hover>.tab-stack>.tab-background:not([selected=true]) {
  background-color: var(--aqua-tab-hover-background) !important;
  border-image: none !important;
  border-bottom: 1px solid var(--aqua-tab-border-color) !important;
}

/* full width tabs */

.tabbrowser-tab:not([style^="max-width"]):not([pinned]),
.tabbrowser-tab[style^="max-width: 100 !important;"]:not([pinned]) {
  max-width: 100% !important;
}

.tabbrowser-tab:not([style^="max-width"]):not([pinned]):not([fadein]),
.tabbrowser-tab[style^="max-width: 100 !important;"]:not([pinned]):not([fadein]) {
  max-width: .1px !important;
}

/* remove blank spaces on tabs start and end */
#TabsToolbar .titlebar-spacer {
  display: none !important;
}

/* hide and show close tab button */

.tabbrowser-tab .tab-close-button {
  display: none !important;
  margin: 0 6px !important;
  -moz-box-ordinal-group: 0 !important;
}

.tabbrowser-tab .tab-label-container {
  padding: 0 16px;
}

.tabbrowser-tab:hover .tab-label-container {
  padding-left: 0;
}

.tabbrowser-tab:not([pinned="true"]):hover .tab-icon-image,
.tabbrowser-tab:not([pinned="true"]):hover .tab-throbber {
  display: none;
}

.tabbrowser-tab:not([pinned="true"]):hover .tab-close-button {
  display: -moz-box !important;
}

.tabbrowser-tab[fadein]:not([pinned]) {
  max-width: 100% !important;
}

#TabsToolbar .tab-close-button {
  -moz-box-ordinal-group: 0 !important;
  -moz-margin-start: -4px !important;
  -moz-margin-end: 4px !important;
  transition: opacity 200ms !important;
  list-style-image: url('data:image/svg+xml;utf8,\<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16">\<line x1="4.5" y1="4.5" x2="11.5" y2="11.5" stroke="rgb(84,82,84)" stroke-width="1"/>\<line x1="4.5" y1="11.5" x2="11.5" y2="4.5" stroke="rgb(84,82,84)" stroke-width="1"/>\</svg>') !important;
}

@media (max-resolution: 1.9dppx) {
  #TabsToolbar .tab-close-button {
    list-style-image: url('data:image/svg+xml;utf8,\<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16">\<line x1="4.5" y1="4.5" x2="11.5" y2="11.5" stroke="rgb(84,82,84)" stroke-width="1.5"/>\<line x1="4.5" y1="11.5" x2="11.5" y2="4.5" stroke="rgb(84,82,84)" stroke-width="1.5"/>\</svg>') !important;
  }
}

/* new-tab and all-tabs buttons */

:root .toolbarbutton-1 {
  --toolbarbutton-border-radius: 0;
  --toolbarbutton-outer-padding: 0;
  border-left: 1px solid var(--aqua-tab-separator-color);
  margin-left: -1px !important;
}

.toolbarbutton-1:hover {
  background-color: var(--aqua-tab-hover-background);
}
